<template>
	<view class="uiwu">
		<view class="items uiwu-flex-space">
			<text>背景音乐</text>
			<switch :checked="userInfo.is_open_music == 1 ? true : false" style="transform: scale(0.7);" @change="setSysConfig" color="#EF821E" />
		</view>
		<view class="item uiwu-flex-space" @tap.stop="uiwu.openWindow('/pages/user/about')">
			<text>关于</text>
			<uiwu-icon type="arrowright" size="18" color="#999"></uiwu-icon>
		</view>
		<view class="item uiwu-flex-space" @tap.stop="uiwu.openWindow('/pages/login/agreement')">
			<text>用户协议</text>
			<uiwu-icon type="arrowright" size="18" color="#999"></uiwu-icon>
		</view>
		<view class="item uiwu-flex-space" @tap.stop="uiwu.openWindow('/pages/login/privacy')">
			<text>隐私政策</text>
			<uiwu-icon type="arrowright" size="18" color="#999"></uiwu-icon>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { useStore } from 'vuex';
	import { useredit } from "../../api/api";
	import { userInfo as userData } from '@/api/api';
	import { uiwu } from "../../config/config"
	import { inject , toRef } from "vue";
	const store = inject<any>('store');
	const userInfo = toRef(store.state,'userInfo')
	const stores = useStore();
	const increment = (data,type) => {
	    stores.commit(type, data);
	};
	const getUserInfo = async () => {
		const {data} = await userData();
		increment(data,'set_user')
	}
	const setSysConfig = async () : Promise<any> => {
		const result = await useredit({
			field:'is_open_music',
			value:userInfo.value.is_open_music == 1 ? 0 : 1
		})
		if(!result) return
		uiwu.toast('设置成功')
		getUserInfo()
	}
	
</script>

<style lang="scss">
	page{
		background-color: #e6e6ee;
	}
	.uiwu{
		
	}
	.items{
		margin: 20rpx 0;
		padding: 40rpx 32rpx;
		background-color: #fff;
	}
	.item{
		padding: 40rpx 32rpx;
		background-color: #fff;
		border-bottom: 1rpx solid #e6e6e6;
		text{
			font-size: 28rpx;
			font-weight: 500;
			color: #444444;
		}
		&:last-child{
			border-bottom: 0;
		}
	}
</style>
